<template>
	<view class="lodge-manage">
		<tui-card :header="{
			line:true,
			
		}" :title="{
			text:item.name,
			size:50
		}" :image="{
			height: 120,
			width: 120,
			url:item.url || '/static/images/basic/badge.png'
		}" :tag="{
			text:item.type,
			color:'rgb(170, 174, 180)'
		}" v-for="(item, index) in dataList" :key="index" @click="info(item)">
			<template v-slot:body>
				<tui-list-cell>
					<view class="card-label">
						<text>电</text><text>话：</text>
					</view>
					<view class="card-text">
						{{item.link}}
					</view>
				</tui-list-cell>
				<!-- <tui-list-cell>
					<view class="card-label">
						<text>性</text><text>别：</text>
					</view>
					<view class="card-text">
						{{item.sex === '0'? '男':'女'}}
					</view>
				</tui-list-cell> -->
				<tui-list-cell>
					<view class="card-label">
						<text>身</text><text>份</text><text>证</text><text>号：</text>
					</view>
					<view class="card-text">
						{{item.idCard}}
					</view>
				</tui-list-cell>
			</template>
		</tui-card>
		<view class="tui-footer">
			<tui-button class="tui-btn tui-danger tui-fillet" hover-class="tui-danger-hover" @click="info()">添加成员</tui-button>
		</view>
	</view>
</template>

<script>
	import tuiCard from "@/components/card/card"
	import tuiListCell from "@/components/list-cell/list-cell"
	import tuiButton from "@/components/button/button"
	import utils from "@/utils/util.js"
	export default {
		components:{tuiCard, tuiListCell, tuiButton},
		data(){
			return {
				dataList:[
					// {
					// 	name:'伊玉霞',
					// 	type:'业主身份',
					// 	phone:'180****3385',
					// 	idCard:'430**************825'
					// }
				],
				loading:false
			}
		},
		mounted() {
		   uni.showNavigationBarLoading()
		   let that = this;
		   this.java110Context.getOwner(function (_owner) {
			 that.setData({
			   communityId: _owner.communityId,
			   ownerId: _owner.memberId
			 })
			 that.getTable(1);
		   });
		},
		methods:{
			setData(obj){
				Object.keys(obj).forEach(key => {
					this[key] = obj[key]
				})
			},
			getTable(page, override){
				let that = this;
				    this.setData({
				      loading: true
				    });
				    let _paramIn = {
				      "communityId": that.communityId,
				      "ownerId": that.ownerId
				    };
				    that.java110Context.request({
				      url: that.java110Constant.url.queryOwnerMembers,
				      header: that.java110Context.getHeaders(),
				      method: "GET",
				      data: _paramIn,
				      success: function (res) {
						uni.hideNavigationBarLoading()
				        if (res.statusCode == 200) {
				          let _owners = res.data.owners;
				          that.setData({
				            dataList : _owners,
				            loading: false
				          })
				        }
				      },
				      fail:function(e){
						uni.hideNavigationBarLoading()
						this.loading = false;
				        uni.showToast({
				          title: "服务器异常了",
				          icon: 'none',
				          duration: 2000
				        })
				      }
				    })
			},
			info(data){
				let url = './editLodge?'
				if(data){
					url = './infoLodge?'
				}
				// data = data?{...data, edit:true}:{edit:false};
				data = data || {};
				data = utils.param(data);
				uni.navigateTo({
					url:url+data
				})
			}
		}
	}
</script>


<style>
	.lodge-manage{
		height: calc(100vh - 150upx - 30upx);
		overflow-y: auto;
		padding-bottom: 150upx;
		padding-top: 30upx;
		box-sizing: border-box;
		position: relative;
		background-color: rgb(247, 249, 251);
	}
	.lodge-manage .tui-footer{
		position: fixed;
		bottom: 30upx;
		left: 0;
		right: 0;
		padding: 30upx 40upx;
	}
	.lodge-manage .card-label{
		width: 100px;
		display: flex;
		justify-content: space-between;
		text-align: justify;
	}
	.lodge-manage .tui-cell-class{
		display: flex;
		justify-content: space-between;
	}
	.lodge-manage .tui-card{
		margin: 30upx 32upx;
	}
</style>
